import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import request from './utils/request';
import storage from './utils/storage'
import api from './api'
import store from './store';

console.log("环境变量=>", import.meta.env);
const app = createApp(App)

//设置全局vue指令  v-开头的指令  app.directive('指令名称', {})
app.directive('has', {
  beforeMount: (el, binding) => {
    // 获取按钮权限
    let actionList = storage.getItem('actionList')
    let value = binding.value
    // 用户的列表中是否有对应按钮权限标识
    let hasPermission = actionList.includes(value)
    // 没有就隐藏
    if (!hasPermission) {
      // 记得学习dom API！！ 例如-> parentNode.removeChild 移除子节点...
      el.style = 'display: none'
      // 通过宏任务来执行， 因为创建之前还没有dom
      setTimeout(() => {
        el.parentNode.removeChild(el)
      }, 0)
    }
  }
})

app.config.globalProperties.$request = request
app.config.globalProperties.$api = api
app.config.globalProperties.$storage = storage
app.use(router).use(store).use(ElementPlus, { size: 'small' }).mount('#app')